<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // // 声明式函数 
        // function fn1(num1,num2){
        //     return num1+num2;
        // }
        // // 赋值式函数
        // var fn2 = function(num3,num4){
        //     return num3+num4;
        // }
        // // 对象函数
        // var obj = {
        //     name:'张三',
        //     sing:function(){
        //         return this.name+'正在唱歌';
        //     }
        // }
        // // 定时器函数
        // setTimeout(function(){
        //     console.log('hello world')
        // },1000);
        // // 事件处理函数
        // window.onclick = function(e){
        //     console.log(e);
        // }
        // // 高级函数 
        // [1,7,11].forEach(function(item){
        //     console.log(item);
        // });

        // 箭头函数 是es6 推出的 一种新型的函数书写方式 
        // 其实就是 函数的简写 

        // 语法:
        //      ()=>{}

        //     () 形参在这里写
        //     => 固定的必须有 箭头函数的标志 
        //      {} 书写代码段的位置 

        
        // 特点:
            // 1.可以省略小括号不写
            // 如果你的形参只有一个 可以省略小括号不写  
            // 没有形参 或者两个及以上 那么 ()必须写 

            // 2. 可以省略大括号不写 
            //  如果{}内只有一行代码  可以省略大括号

            // 3. return  
            //  如果{} 只有一行代码  
            // 会自动将这一行的结果返回  也就是不用写return
            //  注意 好多行  还得写return 

            // 4. 箭头函数 没有arguments


            // 5. 箭头函数没有this 


            // 6. 箭头函数不能跟new 关键字一起用  
            //  先记住 后边详细解释 



        // 声明式函数 箭头写法
        // 声明式函数 
        // function fn1(num1,num2){
        //     return num1+num2;
        // }
        // 不能简写箭头函数 


        // 赋值式函数
        // var fn2 = (num3,num4)=>{return num3+num4};
        // // 形参 2个及以上 或者 0个形参  () 必须写 
        // console.log(fn2(8,9))
        // 对象函数
        // var obj = {
        //     name:'张三',
        //     sing:()=>{console.log(this.name+'正在唱歌');}
        // }
        // obj.sing();
        // 定时器函数
        // setTimeout(()=>{console.log('1秒后做的事情');},1000);
        // 事件处理函数
        // window.onclick = (e)=>{
        //     console.log(e);
        // }
        // window.onclick = e=>{
        //     console.log(e);
        // }
        // 高级函数 
        // [1,7,11].forEach((item)=>{
        //     console.log(item);
        // });

        

        // 省略小括号  

        // [1,7,11].forEach((item)=>{
        //     console.log(item);
        // });

        // [1,7,11].forEach(item=>{
        //     console.log(item);
        // });


        // 省略大括号  
        // [1,7,11].forEach(item=>{
        //     console.log(item);
        // });
        // 上面 {}内只有一行  {} 可以省略 
        // [1,7,11].forEach(item=> console.log(item));
        // window.onclick = e=>{
        //     console.log(e);
        // }
        // window.onclick = e=> console.log(e);


        // return

        // var arr = [{id:1},{id:2},{id:3},{id:4},{id:5},{id:6},{id:7}];
        // var id = 7;
        // var data = arr.find(function(item){return item.id == id})
        // console.log(data);
        // var data = arr.find((item)=>{return item.id == id})
        // console.log(data); // 变成箭头函数
        // var data = arr.find(item=>{return item.id == id})
        // console.log(data);// 只有一个参数  () 省略

        // var data = arr.find((item)=>item.id == id)
        // console.log(data);// 只有一行 {} 省略 return页省略 
        // // 自动会返回这一行的结果 \
    


        // arguments



        // function sum_nums(){
        //     var sum = 0;
        //     for(var i=0;i<arguments.length;i++){
        //         sum += arguments[i];
        //     }
        //     return sum;
        // }

        // var data1 = sum_nums(10,20,30,40,50,60);
        // var data2 = sum_nums(10,20,30,40,50,60,70,80,90,100,110,120);
        // var data3 = sum_nums(10,20,30,40,50,60,70,80,90,100,110,120,130,140,150);

        // console.log(data1);
        // console.log(data2);
        // console.log(data3);


        // var fn3 = ()=>{
        //     console.log(arguments);  //arguments is not defined
        // }

        // fn3(1,3,4,5,67,6,8,8,9,10);
        // fn3(1,3,4,5,67,6,8,8,9,10,6,5,4,33,2,3,5,67,8);
        // fn3(1,3,4,5,67,6,8,8,9,10,2,3,4,45,56,67,7,8,100);




        // this 


        // var fn6 = function(){
        //     alert('赋值式函数'+this);
        // }
        // fn6()
        // setTimeout(function(){
        //     alert('定时器'+this);
        // },1000)

        // var zhagnsan = {
        //     sing:function(){
        //         alert('对象函数'+this);
        //     }
        // }
        // zhagnsan.sing()

        // window.onclick = function(){
        //     alert('事件处理函数'+this);
        // }


        // var fn6 = ()=>{
        //     alert('赋值式箭头函数'+this);
        // }
        // fn6()
        // setTimeout(()=>{
        //     alert('定时器箭头'+this);
        // },1000)

        // var zhagnsan = {
        //     sing:()=>{
        //         alert('对象箭头函数'+this);
        //     } // 本来应该是 对象本身  但是 这里确实window  
        //      说明箭头函数没有自己的this

        // }
        // zhagnsan.sing()

        // window.onclick = ()=>{
        //     alert('事件处理箭头函数'+this);
        // }


        // document.onclick = function(){
        //     console.log(this); // document 
        //     // var fn = function(){
        //     //     console.log(this) // window
        //     // }
        //     // fn()

        //     var fn = ()=>{
        //         console.log(this) //document  没有自己的this 
        //         // 父作用域this代表谁  箭头函数this 代表谁 
        //         // 父作用域  this =>document 
        //         //  箭头函数  this =>document 
        //     }
        //     fn()
        // }


        // setTimeout(function(){
        //     console.log(this); // window
        //     var fn = ()=>{
        //         console.log(this); // this取决于父作用域this
        //     }
        //     fn()
        // },1000);


        // function test(){
        //     console.log(111);
        // }

        // new test(); // 没问题


        // var test2 = ()=>{
        //     console.log(888);
        // }

        // new test2() // 报错 test2 is not a constructor
    </script>
</body>
</html>